import Vue from 'vue'
import VueRouter from 'vue-router'
import Login from '../views/Login.vue'
import Layout from '../views/Layout';

import { getMenus } from '@/api/menus';

Vue.use(VueRouter)

const routes = [
  // 
  {
    path: '/',
    redirect:{name:'UsersIndex'},
    meta:{
      menuname:'首页',
      status:0,
    },
  },

  // 登录
  {
    path: '/login',
    name: 'Login',
    component: Login,
    meta:{
      menuname:'登录',
      status:0,
    },
  },

  // 菜单
  // {
  //   path: '/menus',
  //   name: 'Menus',
  //   component: Layout,
  //   meta:{
  //     menuname:'菜单管理',
  //     status:1,
  //     menuicon:'',
  //   },
  //   children:[
  //     {
  //       path:'index',
  //       name:'MenusIndex',
  //       component: () => import('../views/Users/index.vue'),
  //       meta:{
  //         menuname:'菜单列表',
  //         status:1,
  //         menuicon:'el-icon-document',
  //       },
  //     }
  //   ],
  // },

 
  // 用户
  {
    path: '/users',
    name: 'Users',
    component: Layout,
    meta: {
      needLogin: true,
      menuname: '用户管理',
      status: 1,
      menuicon:'el-icon-setting',
    },
    redirect:{name:'UsersIndex'},
    children: [
      {
        path: 'index',
        name: 'UsersIndex',
        component: () => import('../views/Users'),
        meta: {
          needLogin: true,
          menuname:'用户列表',
          status: 1,
          menuicon:'el-icon-document',
        },
      },
      {
        path: 'add',
        name: 'UsersAdd',
        component: () => import('../views/Users/add.vue'),
        meta: {
          needLogin: true,
          menuname: '添加用户',
          status: 1,
          menuicon:'el-icon-document-add',
        },
      },
      {
        path: 'edit/:id',
        name: 'UsersEdit',
        component: () => import('../views/Users/edit.vue'),
        meta: {
          needLogin: true,
          menuname: '编辑用户',
          status: 0,
        },
        props:true,
      },
      {
        path: "group",
        name: "UsersGroup",
        component: () => import("../views/Users/group"),
        meta: {
          needLogin: true,
          menusname: "权限",
          state: 0,
          menusicon: "",
        },
        props:true,
      },
    ],
  },

  // 班级
  // {
  //   path: '/class',
  //   name: 'Class',
  //   component: Layout,
  //   meta: {
  //     needLogin: true,
  //     menuname: '班级管理',
  //     status: 1,
  //     menuicon:'el-icon-setting',
  //   },
  //   redirect:{name:'ClassIndex'},
  //   children: [
  //     {
  //       path: 'index',
  //       name: 'ClassIndex',
  //       component: () => import('../views/Class'),
  //       meta: {
  //         needLogin: true,
  //         menuname:'班级列表',
  //         status: 1,
  //         menuicon:'el-icon-document',
  //       },
  //     },
  //     {
  //       path: 'add',
  //       name: 'ClassAdd',
  //       component: () => import('../views/Class/add.vue'),
  //       meta: {
  //         needLogin: true,
  //         menuname: '添加班级',
  //         status: 1,
  //         menuicon:'el-icon-document-add',
  //       },
  //     },
  //     {
  //       path: 'edit/:id',
  //       name: 'ClassEdit',
  //       component: () => import('../views/Class/edit.vue'),
  //       meta: {
  //         needLogin: true,
  //         menuname: '编辑班级',
  //         status: 0,
  //       },
  //       props:true,
  //     },
  //   ],
  // },

  // 选项
  // {
  //   path: "/items",
  //   redirect: { name: "ItemsIndex" },
  //   component: Layout,
  //   name: "Items",
  //   meta: {
  //     needLogin: true,
  //     menuname: '选项管理',
  //     status: 1,
  //     menuicon:'el-icon-setting',
  //   },
  //   children: [
  //     {
  //       path: "index",
  //       name: "ItemsIndex",
  //       component: () => import("../views/Items/index.vue"),
  //       meta: {
  //         needLogin: true,
  //         menuname: '选项列表',
  //         status: 1,
  //         menuicon:'el-icon-document',
  //       },
  //     },
  //     {
  //       path: "add",
  //       name: "ItemsAdd",
  //       component: () => import("../views/Items/add.vue"),
  //       meta: {
  //         needLogin: true,
  //         menuname: '添加选项',
  //         status: 1,
  //         menuicon:'el-icon-document-add',
  //       },
  //     },
  //     {
  //       path: "edit/:id",
  //       name: "ItemsEdit",
  //       component: () => import("../views/Items/edit.vue"),
  //       meta: {
  //         needLogin: true,
  //         menuname: '编辑选项',
  //         status: 0,
  //       },
  //       props: true,
  //     },
  //   ],
  // },

  // // 发布
  // {
  //   path: "/release/:id",
  //   name: "Release",
  //   component: () => import("../views/Papers/release"),
  //   props: true,
  //   meta: {
  //     needLogin: true,
  //     state: 0,
  //     menusicon: "",
  //     menusname: "发布问卷",
  //   },
  // },
  // 大纲
//   {
//     path: '/outlines',
//     redirect: { name: 'OutlinesIndex' },
//     component: Layout,
//     name: 'Outlines',
//     meta:{
//       needLogin:true,
//       menuname:'大纲管理',
//       status:1,
//       menuicon:'el-icon-setting',
//     },
//     children: [
//       { 
//         path: 'index',
//         name: 'OutlinesIndex',
//         component: () => import('../views/Outlines/index.vue'),
//         meta: {
//           menuname: '大纲列表',
//           status: 1,
//           menuicon:'el-icon-document',
//         }, 
//       },
//       { 
//         path: 'add', 
//         name: 'OutlinesAdd',
//         component: () => import('../views/Outlines/add.vue'),
//         meta: {
//           menuname: '添加大纲',
//           status: 1,
//           menuicon:'el-icon-document-add',
//         }, 
//       },
//       {
//         path: 'edit/:id',
//         name: 'OutlinesEdit',
//         component: () => import('../views/Outlines/edit.vue'),
//         meta: {
//           menuname: '编辑大纲',
//           status: 0,
//         },
//         props: true,
//       },
//     ],
//   },

  // // 问卷
  // {
  //   path: "/papers",
  //   redirect: { name: "PapersIndex" },
  //   component: Layout,
  //   name: "Papers",
  //   meta: {
  //     needLogin: true,
  //     menuname: '问卷管理',
  //     status: 1,
  //     menuicon:'el-icon-setting',
  //   },
  //   children: [
  //     {
  //       path: "index",
  //       name: "PapersIndex",
  //       component: () => import("../views/Papers/index.vue"),
  //       meta: {
  //         needLogin: true,
  //         menuname: '问卷列表',
  //         status: 1,
  //         menuicon:'el-icon-document',
  //       },
  //     },
  //     {
  //       path: "add",
  //       name: "PapersAdd",
  //       component: () => import("../views/Papers/add.vue"),
  //       meta: {
  //         needLogin: true,
  //         menuname: '添加问卷',
  //         status: 1,
  //         menuicon:'el-icon-document-add',
  //       },
  //     },
  //     {
  //       path: "edit/:id",
  //       name: "PapersEdit",
  //       component: () => import("../views/Papers/edit.vue"),
  //       meta: {
  //         needLogin: true,
  //         menuname: '编辑问卷',
  //         status: 0,
  //       },
  //       props: true,
  //     },
  //   ],
  // },

  // // 答卷
  // {
  //   path: '/answers',
  //   name: 'Answers',
  //   component: Layout,
  //   meta: {
  //     needLogin: true,
  //     menuname: '答卷管理',
  //     status: 0,
  //     menuicon:'el-icon-setting',
  //   },
  //   redirect:{name:'AnswersIndex'},
  //   children: [
  //     {
  //       path: 'index/:id',
  //       name: 'AnswersIndex',
  //       component: () => import('../views/Answers/index.vue'),
  //       props:true,
  //       meta: {
  //         needLogin: true,
  //         menuname:'答卷列表',
  //         status: 0,
  //         menuicon:'el-icon-document',
  //       },
  //     },
  //     {
  //       path: "look/:id",
  //       name: "AnswersLook",
  //       component: () => import("../views/Answers/look"),
  //       meta: {
  //         needLogin: true,
  //         menusname: "查看答卷",
  //         state: 0,
  //         menusicon: "",
  //       },
  //       props: true,
  //     },
  //   ],
  // },

  // // 权限 rbac
  // {
  //   path: "/policies",
  //   name: "Policies",
  //   component: Layout,
  //   redirect: { name: "PoliciesIndex" },
  //   meta: {
  //     needLogin: true,
  //     menuname: "权限管理",
  //     status: 1,
  //     menuicon: "el-icon-setting",
  //   },
  //   props:true,
  //   children: [
  //     {
  //       path: "index",
  //       name: "PoliciesIndex",
  //       component: () => import("../views/Policies/index"),
  //       props:true,
  //       meta: {
  //         needLogin: true,
  //         menuname: "权限列表",
  //         status: 1,
  //         menuicon: "el-icon-document",
  //       },
  //     },
  //     {
  //       path: "add",
  //       name: "PoliciesAdd",
  //       component: () => import("../views/Policies/add"),
  //       props:true,
  //       meta: {
  //         needLogin: true,
  //         menuname: "添加权限",
  //         status: 1,
  //         menuicon: "el-icon-document-add",
  //       },
  //     },
  //     {
  //       path: "edit",
  //       name: "PoliciesEdit",
  //       component: () => import("../views/Policies/edit"),
  //       props:true,
  //       meta: {
  //         needLogin: true,
  //         menuname: "编辑权限",
  //         status: 0,
  //         menuicon: "",
  //       },
  //     },
  //   ],
  // },

  // // 个人中心
  // {
  //   path: "/usercenter",
  //   name: "UserCenter",
  //   component: Layout,
  //   redirect: { name: "UserCenterIndex" },
  //   meta: {
  //     needLogin: true,
  //     menuname: "个人中心",
  //     status: 1,
  //     menuicon: "el-icon-unlock",
  //   },
  //   props:true,
  //   children:[
  //     {
  //       path: "index",
  //       name: "UserCenterIndex",
  //       component: ()=>import('@/views/UserCenter/index'),
  //       meta: {
  //         needLogin: true,
  //         menuname: "个人中心",
  //         status: 1,
  //         menuicon: "el-icon-unlock",
  //       },
  //       props:true,
  //     },
  //     {
  //       path: "password",
  //       name: "UserCenterPassword",
  //       component: ()=>import('@/views/UserCenter/password'),
  //       meta: {
  //         needLogin: true,
  //         menuname: "修改密码",
  //         status: 1,
  //         menuicon: "el-icon-unlock",
  //       },
  //       props:true,
  //     }
  //   ]
  // },

  // 菜单
  {
    path: "/menus",
    name: "Menus",
    component: Layout,
    props: true,
    meta: {
      needLogin: true,
      menuname: "菜单管理",
      status: 1,
      menuicon: "el-icon-setting",
    },
    redirect: { name: "MenusIndex" },
    children: [
      {
        path: "index",
        name: "MenusIndex",
        component: () => import("../views/Menus"),
        props: true,
        meta: {
          needLogin: true,
          menuname: "菜单列表",
          status: 1,
          menuicon: "el-icon-s-operation",
        },
      },
      //添加菜单
      {
        path: "add",
        name: "MenusAdd",
        component: () => import("../views/Menus/add"),
        meta: {
          needLogin: true,
          menuname: "添加菜单",
          status: 1,
          menuicon: "el-icon-plus",
        },
      },
      {
        path: "edit",
        name: "MenusEdit",
        component: () => import("../views/Menus/edit"),
        meta: {
          needLogin: true,
          menuname: "编辑菜单",
          status: 0,
          menuicon: "el-icon-plus",
        },
      },
    ],
  },


  {
    path: '/home',
    component: Layout,
    meta: {
      menuname: '首页',
      status: 0,
    },
    // 嵌套子路由
    children: [
      // {
      //   path: 'about',
      //   component: () => import('../views/AboutView.vue'),
      //   meta: {
      //     needLogin: true,
      //   },
      // }
    ]
  },
  {
    path: '*',
    component: () => import('../views/NotFound'),
    meta: {
      menuname: '404',
      status: 0,
    },
  },
];

const router = new VueRouter({
  routes,
});

// const asyncRoutes = [];

// (async () => {
//   try {
//     const { data } = await getMenus();
//     console.log(data);
//     const r = [];
//     data.forEach((el1) => {
//       r.push({
//         path: el1.routepath,
//         name: el1.routename,
//         // component: Layout,
//         meta:{
//           menuname:el1.menuname,
//           menuicon:el1.menuicon,
//           status:el1.status,
//         },
//       });
//     });
//     console.log(r);
//   } catch (error) {
    
//   }
// })();
  
function createRoute(data) {
  const r = [];
  data.forEach((el1) => {
    const obj = {
      path: el1.routepath,
      name: el1.routename,
      component: () => import(`@/${el1.component}`),
      props: true,
      meta: {
        menuname: el1.menuname,
        menuicon: el1.menuicon,
        status: el1.status,
      },
      children: [],
    };
    el1.children.forEach((el2) => {
      obj.children.push({
        path: el2.routepath,
        name: el2.routename,
        component: () => import(`@/${el2.component}`),
        props: true,
        meta: {
          menuname: el2.menuname,
          menuicon: el2.menuicon,
          status: el2.status,
        },
        children: [],
      });
    });
    r.push(obj);
  });
  return r;
};

(async () => {
  if (localStorage.menus) {
    routes.push(...createRoute(JSON.parse(localStorage.menus)));
    router.matcher = new VueRouter({
      routes,
    });
    return;
  }
  try {
    const { data } = await getMenus();
    localStorage.menus = JSON.stringify(data);
    routes.push(...createRoute(data));
    // 重置路由
    router.matcher = new VueRouter({
      routes,
    });
  } catch (error) {}
})();

router.beforeEach((to, from, next) => {
  if (to.meta.needLogin) {
    if (localStorage.token) {
      next();
    } else {
      next({ name: "Login" });
    }
  }
  // next({name:"login"});
  next();
})

export default router
